<template>
    <div class="content">
        <div class="title">
            <van-icon @click="router.back()" class="icon" size="22px" color="#fff" name="arrow-left" />
            <div class="text">{{ $t('邀請記錄') }}</div>
            <div></div>
        </div>
        <div class="tab">
            <div>{{ $t('用户') }}</div>
            <div>{{ $t('等級') }}</div>
            <div>{{ $t('時間') }}</div>
        </div>
    </div>
</template>

<script setup>
import { ref } from 'vue';
import { useRouter } from 'vue-router';

const router = useRouter()
</script>

<style lang="scss" scoped>
.content {
    width: 100vw;
    height: 100vh;
    background-color: #17171a;
    padding: 0 15px;
    box-sizing: border-box;

    .title {
        display: flex;
        justify-content: space-between;
        align-items: center;
        width: 100%;
        height: 54px;
        padding: 15px 0;
        box-sizing: border-box;

        .text {
            font-size: 15px;
            color: #fff;
        }
    }

    .tab {
        display: flex;
        justify-content: space-between;
        font-size: 13px;
        color: #d5d5d5;
    }
}
</style>